import React, { Component } from 'react'
import {
  Form,
  Button,
  Modal,
  Icon,
  Spin
} from 'antd'
import styles from './index.less';
import noData from '@/assets/icons/暂无数据.png'
export class PopoutRelevance extends Component {
  state = {
    showModel1: false,
    showModel2: false,
    showModel3: false,
    showModel4: false,

  }

  handleOpen = (type) => {

    // console.log(this.props.text)
    this.props.onSubmitA(this.props.text) // 传递id参数
    this.setState({
      // 动态控制变量 加[就会把key当成变量'']
      [type]: true,
      showModel4: true
    })
  }




  render() {
    const MyIcon = Icon.createFromIconfontCN({
      scriptUrl: '//at.alicdn.com/t/font_1131883_kqq0txcd01.js', // 在 iconfont.cn 上生成
    });
    const MyIconA = Icon.createFromIconfontCN({
      scriptUrl: '//at.alicdn.com/t/font_1131883_eq6bow0cxdf.js',
    });
    const umList = this.props.updowndate
    return (

      <div>
        <div className='zdyButtonA'>
          <Button
            // disabled={this.state.showModel4}
            // className={styles.buttonb}
            icon={this.props.icons}
            type='primary'
            size="small"
            onClick={() => this.handleOpen('showModel1')}>
            {this.props.name}
          </Button>
        </div>
        <Modal
          style={{ top: 60 }}
          width={'calc( 50vw)'}
          className={styles.overa}
          title={`${this.props.title}`}
          visible={this.state.showModel1}
          footer={null}
          onCancel={() => {
            setTimeout(() => {
              this.setState({
                showModel4: false
              })
            }, 100)
            this.setState({
              showModel1: false,
            })
            this.props.empty()
          }}
          onOk={() => { // 确定方法不开出去
            this.setState({
              showModel1: false
            })
          }}
        >
          <Spin spinning={this.props.loginjqr}>
            {/* 用户模版 */}
            <div className={styles.over}>
              {this.props.updowndate[0] === 1 ? <div style={{ marginTop: 150, marginLeft: 240 }}><img src={noData} /><p style={{ paddingLeft: 32 }}>暂无对话 ... </p></div> : this.props.updowndate.map((item, index) => {
                return (
                  <div key={index}>
                    <div className={styles.character1}>
                      <div className={styles.character1A}>
                        <div className={styles.character1Aimg}>
                          <MyIcon
                            style={{ fontSize: 20 }}
                            type="icon-yonghu"
                          />
                        </div>
                      </div>
                      <div className={styles.character1B}>
                        <span>{item.userId}</span>
                        {/* <div>{item.question}</div> */}
                        <div dangerouslySetInnerHTML={{ __html: item.question }}></div>
                      </div>
                      <div className={styles.character1A}>
                        <div className={styles.character1Aimg} style={{ background: '#ffffff' }} />
                      </div>
                    </div>

                    <div className={styles.character1}>
                      <div className={styles.character1A}>
                        <div className={styles.character1Aimg} style={{ background: '#ffffff' }} />
                      </div>
                      <div className={styles.character1B}>
                        <div className={styles.nm}>
                          <div style={{ fontSize: 12 }} className={styles.op}>机器人</div>
                          {/* <div>{item.answer}</div> */}
                          <div dangerouslySetInnerHTML={{ __html: item.answer }}></div>
                        </div>

                      </div>
                      <div className={styles.character1A}>
                        <div className={styles.character1Aimg} style={{ background: '#abe5f5' }}>
                          <MyIconA
                            style={{ fontSize: 20 }}
                            type="icon-jiqiren"
                          />
                        </div>
                      </div>
                    </div>
                  </div>
                );
              })}

            </div>
          </Spin>
        </Modal>
      </div >
    )
  }
}

export default PopoutRelevance
